<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"> 
      
   		<rich:collapsiblePanel header="Datos Generales">
				<h:panelGrid columns="2">
					<img src="" />
					<h:panelGrid columns="2">
						<h:outputLabel value="Nombres: " />
						<h:inputText value="#{datosCoordinadorController.usuarioLogueado.nombres}" maxlength="150" size="35" onblur="this.value=this.value.toUpperCase();"/>
						<h:outputLabel value="Apellidos: " />
						<h:inputText value="#{datosCoordinadorController.usuarioLogueado.apellidos}" maxlength="150" size="35" onblur="this.value=this.value.toUpperCase();"/>
						<h:outputLabel value="C.I. " />
						<h:inputText value="#{datosCoordinadorController.usuarioLogueado.identificacion}"    maxlength="10"  onkeypress="return aceptarNumeros(event);"   validatorMessage="Solo puede ingresar números">
							<f:validateRegex pattern="[0-9 ]*" />
						</h:inputText>
						<h:outputLabel value="Nacionalidad/Etnia: " />
						<h:selectOneMenu id="cmbNacionalidades"  value="#{datosCoordinadorController.usuarioLogueado.idnacionalidad}" >
										<f:selectItems value="#{datosCoordinadorController.nacionalidades}" />
						</h:selectOneMenu>
						<h:outputLabel value="Lugar de Nacimiento: " />
						<h:selectOneMenu id="cmbCiudadesSinProvincia"  value="#{datosCoordinadorController.ciudadSeleccionada}" >
										<f:selectItems value="#{datosCoordinadorController.ciudades}" var="r" itemLabel="#{r.descripcion}"  
       	 											itemValue="#{r.id}" />
						</h:selectOneMenu>
						<h:outputLabel value="Fecha de Nacimiento: " />
						<rich:calendar value="#{datosCoordinadorController.usuarioLogueado.fechanacimiento}" 
									maxlength="10" tabindex="1" enableManualInput="true" oninputkeypress="return aceptarFecha(event);" 
									datePattern="dd/MM/yyyy" 
									locale="es" todayControlMode="hidden" />
						
						<h:outputLabel value="Sexo: " />
						<h:selectOneRadio tabindex="1" id="rbtSexo" value="#{datosCoordinadorController.usuarioLogueado.genero}" required="true" requiredMessage="Debe indicar el género M/F">
							<f:selectItem itemLabel="M" itemValue="M" value="#{datosCoordinadorController.itemSeleccionado}" />
							<f:selectItem itemLabel="F" itemValue="F" value="#{datosCoordinadorController.itemSeleccionado}" />
					</h:selectOneRadio>
						
					</h:panelGrid>
				</h:panelGrid>
			</rich:collapsiblePanel>
			<rich:collapsiblePanel header="Datos de Contacto">
				<h:panelGrid columns="4">
					<h:outputLabel value="Móvil: " />
					<h:inputText value="#{datosCoordinadorController.usuarioLogueado.mobil}"    maxlength="10"  onkeypress="return aceptarNumeros(event);"   validatorMessage="Solo puede ingresar números">
							<f:validateRegex pattern="[0-9 ]*" />
					</h:inputText>
					<h:outputLabel value="Operadora: " />
					<h:selectOneMenu id="cmbOperadoras"  onchange="submit()" value="#{datosCoordinadorController.usuarioLogueado.idoperadora}" >
												<f:selectItems value="#{datosCoordinadorController.operadoras}" />
					</h:selectOneMenu>
					
				</h:panelGrid>
				<h:panelGrid columns="2">
						<h:outputLabel value="Teléfono: " />
						<h:inputText value="#{datosCoordinadorController.usuarioLogueado.telefono}"    maxlength="10"  onkeypress="return aceptarNumeros(event);"   validatorMessage="Solo puede ingresar números">
							<f:validateRegex pattern="[0-9 ]*" />
						</h:inputText>
						<h:outputLabel value="Email ERA: " />
						<h:inputText value="#{datosCoordinadorController.usuarioLogueado.mailera}"  >
						
						</h:inputText>
						<h:outputLabel value="Email Institucional: " />
						<h:inputText value="#{datosCoordinadorController.usuarioLogueado.mailinstitucional}"  >
						
						</h:inputText>
						<h:outputLabel value="Email Personal: " />
						<h:inputText value="#{datosCoordinadorController.usuarioLogueado.mailpersonal}"  >
						
						</h:inputText>
						
						
				</h:panelGrid>
				
			</rich:collapsiblePanel>
			<rich:collapsiblePanel header="Estudios Realizados">
					<h:commandLink action="#{datosCoordinadorController.agregarEstudio()}" >
			  			<h:graphicImage value="/img/Nuevo.png"></h:graphicImage>
			  			<h:outputLabel value="Nuevo Estudio" />
			  		</h:commandLink>
					<rich:dataTable id="tblEstudios" value="#{datosCoordinadorController.usuarioLogueado.estudiosrealizadosCollection}" var="estudio" rows="20" >
					<rich:column style="text-align:center;" >
						<f:facet name="header">
							<h:outputText value="Editar" />
						</f:facet>
	
						<h:commandLink action="#{datosCoordinadorController.editarEstudio()}">
						      <h:graphicImage value="/img/Editar.png" alt="Editar #{catalogoController.titulo}" style="border:0;" >
							
						       </h:graphicImage>
						       	<f:param name="fila" value="#{item.id}" />
						       
						 </h:commandLink>
   					</rich:column>

					<rich:column style="text-align:center;" >
						<f:facet name="header">
							<h:outputText value="Eliminar" />
						</f:facet>
							 <h:commandLink  action="#{datosCoordinadorController.eliminarEstudio()}" onclick="if (! confirm('Está serguro de eliminar el registro seleccionado?') ) { return false;}; return true; "  >
								<h:graphicImage url="/img/delete.png" style="border:0;" alt="Eliminar" />
											<f:param name="fila" value="#{item.id}" />
							</h:commandLink>		
					</rich:column>
					<rich:column style="text-align:center;" sortBy="#{estudio.nivel}">
						<f:facet name="header">
							<h:outputText value="Nivel" />
						</f:facet>
						<h:outputText value="#{estudio.nivel}" />
					</rich:column>
					<rich:column style="text-align:center;" sortBy="#{estudio.institucion}">
							<f:facet name="header">
								<h:outputText value="Institución" />
							</f:facet>
							<h:outputText value="#{estudio.institucion}" />
					</rich:column>
					<rich:column style="text-align:center;" sortBy="#{estudio.titulo}">
							<f:facet name="header">
								<h:outputText value="Título" />
							</f:facet>
							<h:outputText value="#{estudio.institucion}" />
					</rich:column>
			</rich:dataTable>
			</rich:collapsiblePanel>	
			<rich:collapsiblePanel header="Datos Trabajo ubicación">
				<h:panelGrid columns="2">
						<h:outputLabel value="Región: " />
						
						<h:selectOneMenu id="cmbRegion"  value="#{datosCoordinadorController.regionSeleccionada}"  valueChangeListener="#{datosCoordinadorController.regionChanged}">
										<f:selectItem itemLabel="[Seleccione una región]"   noSelectionOption="true"/>
												<f:selectItems value="#{datosCoordinadorController.regiones}" var="r" itemLabel="#{r.descripcion}"  
       	 											itemValue="#{r.id}" />
       	 											<a4j:ajax event="valueChange" render="provincias" execute="@this" ></a4j:ajax>
						</h:selectOneMenu>
						
						<h:outputLabel value="Provincia: " />
						<a4j:outputPanel id="provincias" layout="block"  >
							<h:selectOneMenu id="cmbProvincia"  value="#{datosCoordinadorController.provinciaSeleccionada}" 
							onchange="submit()"
							valueChangeListener="#{datosCoordinadorController.provinciaChanged}">
										<f:selectItem itemLabel="[Seleccione una provincia]"   noSelectionOption="true"/>
										<f:selectItems value="#{datosCoordinadorController.provincias}"  var="r" itemLabel="#{r.descripcion}"  
       	 											itemValue="#{r.id}"/>
<!-- 										<a4j:ajax event="valueChange" render="ciudades" execute="@this" ></a4j:ajax>  -->
							</h:selectOneMenu>
					   </a4j:outputPanel> 
						
							<h:outputLabel value="Cantón " />
<!-- 						<a4j:outputPanel id="ciudades" layout="block"> -->
							<h:selectOneMenu id="cmbCanton"  value="#{datosCoordinadorController.cantonSeleccionado}" >
													<f:selectItems value="#{datosCoordinadorController.cantones}" var="r" itemLabel="#{r.descripcion}"  
       	 											itemValue="#{r.id}"/>
							</h:selectOneMenu>
<!-- 						</a4j:outputPanel> -->
						
						<h:outputLabel value="Parroquía: " />
						<h:inputText value="#{datosCoordinadorController.usuarioLogueado.parroquia}"  />
						
						<h:outputLabel value="Comunidad/Recinto: " />
						<h:inputText value="#{datosCoordinadorController.usuarioLogueado.comunidad}"  />
						
						
					
				</h:panelGrid>
			</rich:collapsiblePanel>
		
</html>